<template>
	<view class="tvdd">
		<view style="position: fixed;z-index: 8;">

			<view class="search">
				<uni-search-bar @confirm="search"  v-model="goods_name" @input="input" cancelButton="none"
					radius="60" bgColor="#F7F7F7" placeholder="请输入商品名称">
				</uni-search-bar>
			</view>
			<view class="ullist">
				<view :class="{active:active==index}" @click="dzclick(index)" v-for="(item,index) in data" :key="index">
					{{item.name}}
				</view>
			</view>
		</view>
		<view class="ddList">
			<view class="dlist" v-for="(itme,index) in ListInfo" :key="index">
				<view class="dhead">
					<text class="color-bf">下单时间：<text style="font-size: 30rpx;">{{itme.add_time}}</text></text>
					<text class="color-bf">{{itme.state_desc}}</text>
				</view>
				<!-- 订单内店铺循环 -->
				<view v-for="(store,store_index) in itme.order_list" :key="store.store_id">
					<view class="dptitle">
						<view v-if="store.store_name!=''">
							<image src="/static/images/dplogo.png" mode=""></image><text>{{store.store_name}}</text>
						</view>
					</view>
					<view class="flexBox" style="width: 100%;">
						<view style="font-size: 26rpx;">订单号：{{store.order_sn}}</view>
						<text class="" v-if="!store.if_cancel" style="color: #ff4300;">{{store.order_state_txt}}</text>
					</view>
					<view class="dhead" v-if="store.order_state==10&&store.daoji!='00:00后自动取消'">
						<text class="color-bf">取消时间： </text>
						<text class="color-bf"><text>{{store.daoji}}</text></text>
					</view>

					<!-- 店铺内订单循环 -->
					<view @click="goOrderInfo(store.order_id)" v-for="(order,index2) in store.goods_list"
						:key="order.goods_id">
						<view class="dcont ptb">
							<view class="m-r10">
								<image :src="order.goods_image_url" mode=""></image>
								<image v-if="order.status==0" class="cartShelf" :src="`${picUrl}/xiajia.png`"></image>
							</view>

							<view class="cont ">
								<text class="clamp wdth ft-24">{{order.goods_name}}</text>
								<view class="ds-flex ft-24">
									<view class="flex_warp">
										<text class="goods_spec"
											:class="{mar:order.goods_spec}">{{order.goods_spec}}</text>
										<text v-if="order.goods_type==2" class="zengpin">抢购</text>
										<text v-if="order.goods_type==3" class="zengpin">限时折扣</text>
										<text v-if="order.goods_type==4" class="zengpin">组合套装</text>
										<text v-if="order.goods_type==5" class="zengpin">赠品</text>
										<text v-if="order.goods_type==6" class="zengpin">秒杀</text>
										<text v-if="order.goods_type==7" class="zengpin">拼团</text>
										<text v-if="order.goods_type==8" class="zengpin">砍价</text>
										<text v-if="order.goods_type==9" class="zengpin">特价</text>
										<text v-if="order.goods_type==10" class="zengpin">直降</text>
										<text v-if="order.goods_type==11" class="zengpin">加价购</text>
										<text v-if="order.goods_type==12" class="zengpin">N元任选</text>
										<text v-if="order.goods_type==13" class="zengpin">M付N件</text>
										<text v-if="order.goods_type==14" class="zengpin">N件折</text>
										<text v-if="order.goods_type==15" class="zengpin">预售</text>
										<text v-if="order.goods_type==16" class="zengpin">员购</text>
										<text v-if="order.goods_type==17"
											class="zengpin">{{order.goods_type_desc}}</text>
									</view>
								</view>
								<view class="ds-flex ft-24 flexBox" style="margin-top: 10rpx;">
									<view class="">


									</view>

									<view class="">

										<text @click.stop="goGOGO(order.rec_id,order.order_id,index,0)"
											v-if="order.refund==1" class="tousu">退货</text>
										<text v-else-if="order.refund==0&order.refund_type ==2&order.refund_state!=3"
											class="tousu">退货中</text>
										<text v-else-if="order.refund==0&order.refund_type ==2&order.refund_state==3"
											class="tousu">已退货</text>
										<text @click.stop="goGOGO(order.rec_id,order.order_id,index,1)"
											v-if="order.refund==1" class="tousu">换货</text>
										<text v-else-if="order.refund==0&order.refund_type ==3&order.refund_state!=3"
											class="tousu">换货中</text>
										<text v-else-if="order.refund==0&order.refund_type ==3&order.refund_state==3"
											class="tousu">已换货</text>


										<!-- <text v-if="store.if_deliver"
											class="tuikuan" @click.stop="wuliu(store,order.rec_id)">查看物流</text> -->
										<text v-if="store.if_evaluation"
											@click.stop="goPinJia(order.goods_id,store.order_id)"
											class="tuikuan">评价</text>
										<text v-if="order.evaluation_state==1&store.order_state==40"
											class="tuikuan">已评价</text>
										<text
											v-if="itme.order_state!='10'&&itme.order_state!='0'&&itme.order_state!='15'&& store.if_complain"
											class="tousu" @click.stop="tousu(order.rec_id,store.order_id)">投诉</text>
									</view>
								</view>
							</view>
							<view class="contf">
								<view class="text-rg"><text
										style="font-size: 24rpx;margin-right: 5rpx;">¥</text>{{order.goods_price}}
								</view>
								<view style="font-size: 26rpx;color: #B2B2B2;">x{{order.goods_num}}</view>
							</view>

						</view>

					</view>
					<!-- 共{{itme.goods_num}}件商品 -->
					<view class="" style="display: flex;justify-content: space-between;">
						<view style="text-align: left;">店铺订单共计：{{store.order_amount}}元</view>
						<view class="" style="text-align: right;">
							<text class="ptbot" v-if="store.if_cancel"
								@click="quxiadd(store.order_id,index)">取消订单</text>

						</view>
					</view>
					<!-- {{itme.order_list[0].tail_pay_start_time +" "}}{{Time+" "}}{{itme.order_list[0].tail_pay_end_time}} -->
					<view class="tijiao">
						<!-- v-if="itme.order_state!='40'&itme.order_state!=0" -->
						<!-- <view>
							<text v-if="itme.order_state!='10'&&itme.order_state!='0'&&itme.order_state!='15'&& store.if_complain"  class="ptbot" @click.stop="tousu(itme.order_list[0].extend_order_goods[0].goods_id,store.order_id)">投诉{{itme.if_complain}}</text>
						</view> -->
						<view class="" style="display: flex;justify-content: flex-start;color:#ff4300"
							v-if="findStoreOrder(itme.order_list)!='-1'&&store_index==itme.order_list.length-1&&itme.pay_amount!=undefined">
							共计:{{parseFloat(itme.pay_amount).toFixed(2)}}
						</view>
						<!-- 待支付 -->
						<view class="flex">
							<text
								v-if="store.order_state=='15'  && itme.order_list[0].tail_pay_start_time<Time/1000 && itme.order_list[0].tail_pay_end_time>Time/1000"
								class="ysbot"
								@click="goPay(itme.order_list[0].tail_pay_sn,itme.order_list[0].extend_order_goods[0].goods_tail_money,1)">支付尾款</text>


							<text class="ysbot"
								v-if="findStoreOrder(itme.order_list)!='-1'&&itme.pay_amount!=undefined&&store.payment_code!='transfer'"
								@click="goPay(itme.pay_sn,itme.pay_amount,0)">去付款</text>
							<text v-if="store.if_refund_cancel" class="ptbot" @click="refund(store.order_id)">退款</text>
							<text v-if="store.if_lock  && store.refund_state==0 && store.order_state==20"
								class="ptbot">退款中</text>
							<!-- v-if="store.if_deliver" -->
							<text v-if="store.if_deliver" @click="wuliu(itme)" class="ptbot">查看物流</text>
							<text v-if="store.if_receive" @click="confirmGoods(itme)" class="ysbot">确认收货</text>

						</view>

					</view>
				</view>
			</view>
		</view>
		<view class="None" v-if="isBlank<=0">
			<image style="width: 100%;" :src="`${picUrl}/InfoNull.png`" mode="widthFix"></image>
		</view>

		<!-- 		<view v-if="likeList.length" style="text-align: center;color: #555;">---猜你喜欢---</view>

		<view style="" class="products">
			<view @click="goodsInfo(item.goods_id)" v-for="(item,index) in likeList" :key="index" class="product">
				<view v-if="item.title" class="zk">{{item.title}} </view>
				<view class="ImgBox">
					<image :src="item.goods_image" mode="widthFix"></image>
				</view>
				<view class="productInfo twoline lh35 C333"><text class="is_tv" v-if="item.is_tv==1">自营</text>
					{{item.goods_name}}
				</view>
				<view class="lh50 productP">
					<text class="Ce13d97 fs22">￥{{item.goods_promotion_price}}</text> -->
		<!-- <text class="strick fs18 C999 pl20">￥{{item.goods_marketprice}}</text>					 -->
		<!-- 			</view>
			</view>
		</view> -->
		<uni-popup type="center" ref="cancel">
			<view class="popup-open">确认取消该订单吗？</view>
			<view class="buttons">
				<view style="color: #000;" @click="close">取消</view>
				<view style="color: #fff;background-color: #ff0000ba;" @click="confirmCancel">确认</view>
			</view>
		</uni-popup>
		<go-top :isShow='isShow'></go-top>
	</view>
</template>

<script>
	import goTop from '@/components/go-top/go-top.vue'
	export default {
		components: {
			goTop
		},
		data() {
			return {
				hasmore: false,
				active: 0,
				istype: 2,
				isfuk: 1,
				ListInfo: [], //订单列表
				isBlank: 1, //判断是否显示
				data: [{
						name: '全部订单',
						type: ''
					}, {
						name: '待付款',
						type: 'state_new'
					}, {
						name: '待发货',
						type: 'state_pay'
					},
					// {
					// 	name:'待使用',
					// 	type:'state_use'
					// }, 
					{
						name: '待收货',
						type: 'state_send'
					},
					{
						name: '待评价',
						type: 'state_evaluation'
					},
					{
						name: '已完成',
						type: 'state_success'
					},
				],
				curpage: 1,
				Time: "",
				TimeList: [],
				goods_name: "",
				Times: [],
				likeList: [],
				isShow: false, //返回顶部火箭头
				orderId: ''
			}

		},
		onShow() {

		},
		onLoad(e) {
			this.Time = new Date().getTime();
			if (e.state) {
				this.active = e.state
			}

			this.$nextTick(function() {
				this.Getlist();
			})
			// this.Times.map((item)=>{
			// 	clearInterval(item);
			// })
		},
		onPageScroll(res) {
			if (res.scrollTop > 200) {
				this.isShow = true
			} else {
				this.isShow = false
			}
		},
		onBackPress(options) {

		},
		onReachBottom() {
			if (this.hasmore) {
				this.Getlist()
			} else {
				uni.showToast({
					title: '已是最后一页！',
					icon: 'none'
				})
			}
		},
		onUnload() {
			let page = getCurrentPages()
			let backNumber = 0 //要返回的层数
			page.map((item, index) => {
				if (item.route == 'member/order/AllOrder') {
					backNumber++
				}
			})
			if (backNumber > 1) { //返回去重复页面
				uni.navigateBack({
					delta: backNumber - 1
				});
			}
		},
		methods: {
			input(e) {
				console.log(e)
			},
			dzclick(id) { //切换nav
				this.active = id;
				this.curpage = 1 //更新页数
				this.goods_name = ""
				this.ListInfo = [] //清空订单信息
				this.likeList = [] //请空猜你喜欢
				this.isBlank = 1 //更新空状态
				this.Getlist(true)
			},
			Getlist(id) { //获取订单列表
				//id为true代表重新刷新 不存在则为下一页
				let that = this;
				this.$util.request({
					url: '/mobile/index.php?act=member_order&op=order_list',
					method: 'get',
					data: {
						state_type: that.data[that.active].type,
						curpage: that.curpage,
						goods_keywords: this.goods_name
					},
				}).then(function(res) {
					if (res.error_code == 0) {
						that.hasmore = res.datas.paged.hasmore
						if (id) {
							that.ListInfo = res.datas.order_group_list
						} else {
							that.ListInfo = that.ListInfo.concat(res.datas.order_group_list)
						}
						if (!res.datas.paged.hasmore) {
							that.curpage = false
							if (res.datas.order_group_list.length == 0) {
								that.youLike()
							}

						} else {
							that.curpage++
						}
						if (that.ListInfo.length > 0) {
							// for (let i = 0; i < that.ListInfo.length; i++) {

							// 	that.limitFormatTime8(that.ListInfo[i].cancel_time, i)
							// }
							that.limit()
						}
						that.isBlank = that.ListInfo.length
					} else {
						that.isBlank = that.ListInfo.length
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
				})
			},
			// 查找订单中的是否有可支付订单
			findStoreOrder(order_list) {
				order_list.findIndex((value, index) => {
					return (value.if_cancel == false);
				})
			},
			goodsInfo(id) {
				uni.navigateTo({
					url: '/mall/goods/info?goods_id=' + id
				})
			},
			limit(e) {
				if (!e) {
					e = 0
				}
				let data = Date.now()
				// console.log(data);
				this.ListInfo.map((item, index) => {
					item.order_list.map((item1, index1) => {
						if (item1.order_state == 10) {

							item1.daoji = this.shijian(Number(item1.cancel_time) * 1000 - data)

						}
					})
				})
				this.$forceUpdate()
				// console.log(this.ListInfo);
				setTimeout(() => {
					this.limit(1000)
				}, 1000)
			},
			shijian(e) {
				// console.log(e);
				if (e < 0) {
					return '00' + ":" + '00' + "后自动取消"
				} else {
					// console.log(e);
					var m = parseInt(e / (1000 * 60) % 60);
					var s = parseInt(e / 1000 % 60);
					m = m < 10 ? "0" + m : m;
					s = s < 10 ? "0" + s : s;
					return m + ":" + s + "后自动取消"
				}


			},
			search() {
				// if(this.goods_name){
				this.Getlist(true)
				// }
			},
			//去投诉
			tousu(goods_id, order_id) {
				uni.navigateTo({
					url: '/member/complain/add?goods_id=' + goods_id + '&order_id=' + order_id
				})
			},
			//去评价
			goPinJia(goods_id, order_id) {
				uni.navigateTo({
					url: '/member/evaluate/add?goods_id=' + goods_id + '&order_id=' + order_id
				})
			},
			//去售后页面
			goGOGO(goods_id, order_id, index, state) {
				uni.navigateTo({
					url: '/member/aftermarket/Exchange?order_id=' + order_id + '&goods_id=' + goods_id +
						'&index=' + index + "&state=" + state
				})
			},
			//退款
			refund(id) {
				uni.navigateTo({
					url: '/member/aftermarket/Exchange?order_id=' + id
				})
			},
			//order_id获取
			obtain(item) {
				let id = []
				for (let i = 0; i < item.order_list.length; i++) {
					for (let j = 0; j < item.order_list[i].goods_list.length; j++) {
						id.push(item.order_list[i].goods_list[j].order_id)
					}
				}
				return id = id.join(',')
			},
			//确认收货
			confirmGoods(item) {
				uni.showModal({
					title: '提示',
					content: '确认收货？',
					success: (res) => {
						if (res.confirm) {
							let id = this.obtain(item)
							this.$util.request({
								url: '/mobile/index.php?act=member_order&op=order_receive',
								method: 'POST',
								data: {
									order_id: id
								}
							}).then(res => {
								if (res.error_code == 0) {
									uni.showToast({
										title: '收货成功！'
									})
									this.active = 4
								} else {
									uni.showToast({
										title: res.message,
										icon: "none"
									})
								}
								this.curpage = 1
								this.Getlist(true)
							})
						}
					}
				})
			},
			//查看物流
			wuliu(store, rec_id) {

				// let id=this.obtain(item)
				uni.navigateTo({
					url: '/plug/logistics/info?order_id=' + store.order_list[0].order_id
				})
			},
			//去付款
			goPay(sn, moeny, pay_tail) {
				uni.navigateTo({
					url: '/plug/pay/cashier?pay_sn=' + sn + '&moeny=' + moeny + '&order_sn=' +
						"&pay_tail=" + pay_tail
				})
			},
			//进入商品详情页面
			goOrderInfo(id) {
				uni.navigateTo({
					url: 'orderInfo?order_id=' + id
				})
			},
			//打开取消订单弹窗
			quxiadd(orderId, listIndex) {
				this.orderId = orderId
				this.$refs.cancel.open()
			},
			//弹窗取消
			close() {
				this.$refs.cancel.close()
			},
			//确认取消
			confirmCancel() {
				this.$util.request({
					url: '/mobile/index.php?act=member_order&op=order_cancel',
					method: 'POST',
					data: {
						order_id: this.orderId
					}
				}).then(res => {
					if (res.error_code == 0) {
						this.$refs.cancel.close()
						this.curpage = 1
						this.Getlist(true)
						uni.showToast({
							title: '订单已取消！'
						})
					} else {
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
				})
			},
			//猜你喜欢
			youLike() {
				this.$util.request({
					url: '/mobile/index.php?act=member_index&op=get_guesslike',
					method: '',
					data: {}
				}).then(res => {
					if (res.error_code == 0) {
						this.likeList = res.datas
					} else {
						// uni.showToast({
						// 	title:res.message,
						// 	icon:"none"
						// })
					}
				})
			},
		},
		watch: {
			active(val, oldVal) {
				this.Times.map((item) => {
					clearInterval(item);
				})
			}
		},
		computed: {

		},
		destroyed() {
			this.Times.map((item) => {
				clearInterval(item);
			})
		}
	}
</script>

<style lang="scss" scoped>
	.Ce13d97 {
		color: #ff4300;
	}

	.twoline {
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}

	.products {
		padding: 0 24upx;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		flex-wrap: wrap;
		/* margin-top: 27upx; */
	}

	.product {
		position: relative;
		box-sizing: border-box;
		width: 346upx;
		height: 487upx;
		border: 1upx solid #f4f4f4;
		margin-top: 10upx;
		border-radius: 15upx;
		background-color: #FFFFFF;
	}

	.product .ImgBox {
		width: 336upx;
		height: 340upx;
		overflow: hidden;
	}

	.product image {
		border-top-left-radius: 10upx;
		border-top-right-radius: 10upx;
		width: 336upx;
		height: 340upx;
	}

	.productInfo {
		padding: 0 10upx;
		height: 84upx;
		line-height: 40rpx;
	}

	.productP {
		padding: 0 10upx;
	}

	/* .flex{
		display: ;
	} */
	.tousu {
		border: 1rpx solid #999;
		padding: 5rpx 15rpx;
		margin-left: 20rpx;
		border-radius: 10rpx;
	}

	.flex_warp {
		display: flex;
		flex-wrap: wrap;
	}

	.ptbot:first-child {
		margin-left: 40rpx;
	}

	.mar {
		margin-right: 20rpx;
	}

	.zengpin {
		padding: 2rpx 15rpx;
		border-radius: 5px;
		color: #ffffff;
		background-color: #ff4300;
		font-size: 26rpx;
		margin-right: 20rpx;
	}

	.flexBox {
		width: 450rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.goods_spec {
		font-size: 24rpx;
		color: #666666;
		margin-top: 4rpx;
		white-space: nowrap;
		text-overflow: ellipsis;
		width: 100%;
		overflow: hidden;
	}

	.tuihuo {
		background-color: #CCCCCC;
		color: #FFFFFF;
		padding: 10rpx 10rpx;
		border-radius: 5px;
		margin-right: 10rpx;
		text-align: center;
		line-height: 20px;
		height: 40rpx;
		margin-top: 6rpx;
		font-size: 24rpx;
		width: 55px;
		margin-left: 20rpx;
	}

	.tuikuan {
		background-color: #ff4300;
		color: #FFFFFF;
		padding: 10rpx 15rpx;
		/* 	border: 0.5px solid #979696; */
		border-radius: 5px;
		text-align: center;
		line-height: 20px;
		height: 40rpx;
		margin-top: 15rpx;
		font-size: 24rpx;
		width: 55px;
		margin-left: 20rpx;

	}

	.None {
		font-weight: bold;
		text-align: center;
		/* margin: 40rpx 0; */
		font-size: 30rpx;
	}

	.ptb {
		padding: 20upx 10upx 0;
	}

	.ft-25 {
		font-size: 25upx;
	}

	.ft-23 {
		font-size: 24upx !important;
	}

	.m-r10 {
		margin-right: 10upx;
		position: relative;
	}
	
	.cartShelf {
		width: 172upx;
		height: 50upx !important;
		// border-radius: 10upx;
		position: absolute;
		top: 122upx;
		left: 0;
		z-index: 2;
		// background: rgba(0,0,0,.3);
	}

	/* .text-rg{
		text-align: right;
	} */
	.color-bf {
		color: #ff4300;
	}

	.ds-flex {
		display: flex;
	}

	.clamp {
		display: -webkit-box !important;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		overflow: hidden;

	}

	/* 底部 */
	.tijiao {
		color: #333;
		display: flex;
		justify-content: flex-end;
		align-items: center;
		padding: 0 10upx;
		/* border:0px !important; */
		border-top: 1px solid #F0F0F0;
		margin-top: 10upx;
		margin-bottom: -20rpx;
		padding: 20rpx 0;
	}

	.tijiao>view {
		display: flex;
		width: 100%;
		justify-content: flex-end;
	}

	.tijiao>view>view {
		/* margin-right:50upx; */
	}

	.ptbot {
		padding: 10upx;
		border: 1upx solid #979696;
		border-radius: 10upx;
		/* margin-left:23upx; */
		text-align: center;
		line-height: 40upx;
		width: 110rpx;
		margin-left: 10rpx;
	}

	.tijiao .ysbot {
		padding: 10upx;
		border-radius: 10upx;
		margin-left: 23upx;
		text-align: center;
		line-height: 40upx;
		width: 110rpx;
		color: #fff;
		background: #ff4300;
	}

	.tijiao view:first-of-type {
		font-size: 24upx !important;
	}

	.tijiao view:last-of-type {
		font-size: 24upx !important;
	}

	/* 订单列表 */

	.ddList .dlist .dcont .wdth {

		min-width: 330upx;
		height: 90upx;
	}

	.ddList .dlist .dcont .cont {
		min-width: 330upx;

	}

	.ddList .dlist .dcont {
		display: flex;
		justify-content: space-between;
		/* align-items: center; */
		font-size: 22upx;
	}

	.ddList .dlist .dcont image {
		width: 172upx;
		height: 172upx;
	}

	.ddList .dlist .dptitle text:first-child,
	.ddList .dlist .dcont .contf {
		color: #333;
		height: 100%;
	}

	.contf {
		text-align: right;
		width: 120px;
	}

	/* .dcont .contf .ft-23.ds-flex{
	margin-top: 40rpx;
} */
	.ddList .dlist .dptitle {
		font-size: 26upx;
		display: flex;
		justify-content: space-between;
		padding-top: 10rpx;
		/* padding:30upx; */
	}

	.ddList .dlist .dptitle image {
		width: 28upx;
		height: 24upx;
		margin-right: 10upx;
	}

	.ddList {
		/* margin:28upx; */
		font-size: 22upx;
		padding: 28upx;
		padding-top: 190rpx;
	}

	.ddList .dlist .dhead .fx {
		color: #666;
	}

	.ddList .dlist {
		padding: 25upx;
		background-color: #fff;
		border-radius: 30upx;
		margin-bottom: 40upx;
	}

	.ddList .dlist .dhead {
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 26upx;
		color: #333;
		padding-bottom: 10rpx;
		/* padding:15upx; */
	}

	.ddList .dlist .dhead image {
		width: 29upx;
		height: 29upx;
		margin-left: 10upx;
	}

	/* 切换 */
	.ullist {
		display: flex;
		font-size: 24upx;
		justify-content: space-around;
		color: #333;
		padding: 15upx 0;
		background-color: #fff;
		position: fixed;
		width: 100%;
		z-index: 99999999;
	}

	.ullist .active {
		color: #ff4300;
		padding-bottom: 10upx;
		border-bottom: 2upx solid #ff4300;
	}

	.search {
		position: relative;
		background-color: #FFFFFF;
		z-index: 9999999;
		width: 750rpx;
		box-sizing: border-box;
		height: 90rpx;
	}

	.search input {
		border: 1px solid #CCCCCC;
		height: 60upx;
		text-align: center;
		border-radius: 30upx;
	}

	.searchImg {
		top: 18upx;
		right: 50upx;
		position: absolute;
		z-index: 10;
		width: 50upx;
		height: 50upx;
	}

	.zk {
		/* width: 80upx; */
		padding: 0 15upx;
		height: 40upx;
		background-color: #ff4300;
		color: #FFFFFF;
		text-align: center;
		line-height: 40upx;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;
		border-top-left-radius: 10upx;
	}
	/deep/ .uni-popup__wrapper-box {
		width: 540rpx;
		height: 280rpx;
		background: #fff;
		border-radius: 20rpx;
		display: flex !important;
		flex-direction: column;
		align-items: center;
		padding: 20rpx;
	}
	
	.popup-open {
		font-size: 34rpx;
		text-align: center;
		margin-top: 30rpx;
		color: #000;
	}
	
	.buttons {
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 90%;
		margin-top: 60rpx;
	
		view {
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 32rpx;
			height: 70rpx;
			width: 45%;
			background-color: #EEEEEE;
			border-radius: 40rpx;
		}
	}
</style>